<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="/resources/template/template.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:p="http://primefaces.org/ui">


    <ui:define name="content">
        <h:panelGroup rendered="#{!webUserController.hasPrivilege('HrAdmin')}" >
            You are NOT Authorized
        </h:panelGroup>

        <h:panelGroup rendered="#{webUserController.hasPrivilege('HrAdmin')}" >
            <h:form id="form">
                <p:panelGrid columns="2" styleClass="alignTop" >
                    <h:panelGroup>
                        <p:panel header="Report">
                            <p:selectOneMenu id="mnuCat" value="#{commonReportItemController.category}" >
                                <f:selectItem itemLabel="Select Format" />
                                <f:selectItems value="#{formFormatController.items}" var="rf" itemLabel="#{rf.name}" itemValue="#{rf}" />
                                <f:ajax event="change" execute="mnuCat" render="@all" />
                            </p:selectOneMenu>
                            <h:commandButton rendered="false" value="Add All" action="#{commonReportItemController.addAllToCat}"/>
                            <p:panel header="Add New ..." >
                                <h:commandButton value="Label" action="#{commonReportItemController.addNewLabel()}"/>
                                <h:commandButton value="Value" action="#{commonReportItemController.addNewValue()}"/>
                                <h:commandButton value="Combo" action="#{commonReportItemController.addNewCombo()}"/>
                            </p:panel>
                        </p:panel>
                        <p:panel header="Report Items List" id="pIx">
                            <h:selectOneListbox size="1"  id="dtbItem" value="#{commonReportItemController.current}" style="width: 270px;" >
                                <f:selectItems value="#{commonReportItemController.items}" var="ii" itemLabel="#{ii.name}" itemValue="#{ii}" />
                                <f:ajax event="change" execute="dtbItem" render=":#{p:component('pDetails')} :#{p:component('pPreview')}"/>
                            </h:selectOneListbox>
                            <h:commandButton action="#{commonReportItemController.removeItem()}" value="Remove"/>
                        </p:panel>

                        <p:panel  id="pDetails" >

                            <f:facet name="header" >
                                Item Details
                                <h:commandButton value="Save" action="#{commonReportItemController.saveSelected()}">
                                </h:commandButton>

                            </f:facet>

                            <h:panelGrid  columns="2">
                                <h:outputText value="Name"   />
                                <h:inputText autocomplete="off" id="lblIiName" value="#{commonReportItemController.current.name}" >
                                    <f:ajax event="keyup" execute="lblIiName" render=":#{p:component('pPreview')}"/>
                                </h:inputText>

                                <h:outputText value="Type"/>
                                <h:selectOneListbox id="cmbItemType" value="#{commonReportItemController.current.ixItemType}" size="1" >
                                    <f:selectItem itemLabel="Label" itemValue="Label"/>
                                    <f:selectItem itemLabel="Value" itemValue="Value"/>
                                    <f:selectItem itemLabel="Combo" itemValue="ItemsCatetgory"/>
                                </h:selectOneListbox>

                                <h:outputText value="Content"/>
                                <h:selectOneListbox id="cmbReportItemType" value="#{commonReportItemController.current.reportItemType}" size="1" >
                                    <f:selectItem itemLabel="No Content"/>
                                    <f:selectItems value="#{enumController.reportItemTypes}" ></f:selectItems>
                                </h:selectOneListbox>

                                <h:outputText value="Category"/>
                                <p:autoComplete value="#{commonReportItemController.current.referringCategory}" 
                                                completeMethod="#{metadataSuperCategoryController.completeItems}"
                                                var="cat"
                                                itemLabel="#{cat.name}"
                                                itemValue="#{cat}"
                                                converter="categoryConverter"></p:autoComplete>

                                <h:outputText value="Align"/>
                                <h:selectOneListbox  id="cmbTxtAlign" value="#{commonReportItemController.current.cssTextAlign}" size="1" >
                                    <f:selectItem itemLabel="Left" itemValue="Left"/>
                                    <f:selectItem itemLabel="Right" itemValue="Right"/>
                                    <f:selectItem itemLabel="Center" itemValue="Center"/>
                                    <f:selectItem itemLabel="Justify" itemValue="Justify"/>
                                    <f:selectItem itemLabel="Inherit" itemValue="Inherit"/>
                                </h:selectOneListbox>




                                <h:outputText value="Left" />
                                <p:inputText autocomplete="off" maxlength="3" id="txtLeft" value="#{commonReportItemController.current.riLeft}"/>

                                <h:outputText value="Top"/>
                                <p:inputText autocomplete="off" maxlength="3" id="txtTop" value="#{commonReportItemController.current.riTop}"/>



                                <h:outputText value="Font Size"/>
                                <p:inputText autocomplete="off" maxlength="3" id="txtFontSize" value="#{commonReportItemController.current.riFontSize}" />


                                <h:outputText value="Width"/>
                                <p:inputText autocomplete="off" maxlength="3" id="txtWidth" value="#{commonReportItemController.current.riWidth}" />

                                <h:outputText value="Height"/>
                                <p:inputText autocomplete="off" maxlength="3" id="txtHeight" value="#{commonReportItemController.current.riHeight}"/>



                                <h:outputText value="Value Type"/>
                                <h:selectOneListbox id="cmbValueType" value="#{commonReportItemController.current.ixItemValueType}" size="1" >
                                    <f:selectItem itemLabel="Varchar" itemValue="Varchar"/>
                                    <f:selectItem itemLabel="Memo" itemValue="Memo"/>
                                    <f:selectItem itemLabel="float" itemValue="float"/>
                                    <f:selectItem itemLabel="Integer" itemValue="Integer"/>
                                    <f:selectItem itemLabel="List" itemValue="List"/>
                                    <f:selectItem itemLabel="Image" itemValue="Image"/>
                                    <f:selectItem itemLabel="Line" itemValue="Line"/>
                                    <f:selectItem itemLabel="Rectangle" itemValue="Rectangle"/>
                                    <f:selectItem itemLabel="Circle" itemValue="Circle"/>
                                </h:selectOneListbox>

                                <h:outputText value="Position Type"/>
                                <h:selectOneListbox id="cmbPosition" value="#{commonReportItemController.current.cssPosition}" size="1" >
                                    <f:selectItem itemLabel="Static" itemValue="Static"/>
                                    <f:selectItem itemLabel="Absolute" itemValue="Absolute"/>
                                    <f:selectItem itemLabel="Fixed" itemValue="Fixed"/>
                                    <f:selectItem itemLabel="Relative" itemValue="Relative"/>
                                    <f:selectItem itemLabel="Inherit" itemValue="Inherit"/>
                                </h:selectOneListbox>
                                <h:outputText value="Vertical Align"/>
                                <h:selectOneListbox id="cmbVertical" value="#{commonReportItemController.current.cssVerticalAlign}" size="1" >
                                    <f:selectItem itemLabel="Baseline" itemValue="Baseline"/>
                                    <f:selectItem itemLabel="Sub" itemValue="Sub"/>
                                    <f:selectItem itemLabel="Super" itemValue="Super"/>
                                    <f:selectItem itemLabel="Top" itemValue="Top"/>
                                    <f:selectItem itemValue="TextTop" itemLabel="TextTop"/>
                                    <f:selectItem itemLabel="Middle" itemValue="Middle"/>
                                    <f:selectItem itemLabel="Bottom" itemValue="Bottom"/>
                                    <f:selectItem itemLabel="TextBottom" itemValue="TextBottom"/>
                                    <f:selectItem itemLabel="Inherit" itemValue="Inherit"/>
                                </h:selectOneListbox>

                                <h:outputText value="Over Flow"/>
                                <h:selectOneListbox id="cmbType" value="#{commonReportItemController.current.cssOverflow}" size="1" >
                                    <f:selectItem itemLabel="Auto" itemValue="auto"/>
                                    <f:selectItem itemLabel="Hidden" itemValue="hidden"/>
                                    <f:selectItem itemLabel="Scroll" itemValue="scroll"/>
                                    <f:selectItem itemLabel="Visible" itemValue="visible"/>
                                    <f:selectItem itemLabel="Inherit" itemValue="Inherit"/>
                                </h:selectOneListbox>
                                <h:outputText value="Font Style"/>
                                <h:selectOneListbox  id="cmbPos" value="#{commonReportItemController.current.cssFontStyle}" size="1" >
                                    <f:selectItem itemLabel="Normal" itemValue="Normal"/>
                                    <f:selectItem itemLabel="Italic" itemValue="Italic"/>
                                    <f:selectItem itemLabel="Oblique" itemValue="Oblique"/>
                                </h:selectOneListbox>



                                <h:outputText value="Z Order" />
                                <p:inputText autocomplete="off" id="txtZOrder" value="#{commonReportItemController.current.cssZorder}"/>

                                <h:outputText value="Clip"/>
                                <p:inputText autocomplete="off" id="txtClip" value="#{commonReportItemController.current.cssClip}"/>

                                <h:outputText value="Font Family"/>
                                <p:inputText autocomplete="off" id="txtFontFamily" value="#{commonReportItemController.current.cssFontFamily}"/>

                                <h:outputText value="Font Variant"/>
                                <p:inputText autocomplete="off" id="txtFontVariant" value="#{commonReportItemController.current.cssFontVariant}"/>

                                <h:outputText value="Font Weight"/>
                                <p:inputText autocomplete="off" id="txtFontWeight" value="#{commonReportItemController.current.cssFontWeight}"/>

                                <h:outputText value="Border Radius"/>
                                <p:inputText autocomplete="off" id="txtBorderRadius" value="#{commonReportItemController.current.cssBorderRadius}"/>

                                <h:outputText value="Line Hegiht"/>
                                <p:inputText autocomplete="off" id="txtLineHeight" value="#{commonReportItemController.current.cssLineHeight}"/>

                                <h:outputText value="Margin"/>
                                <p:inputText autocomplete="off" id="txtMargin" value="#{commonReportItemController.current.cssMargin}"/>

                                <h:outputText value="Padding"/>
                                <p:inputText autocomplete="off" id="txtPadding" value="#{commonReportItemController.current.cssPadding}"/>

                                <h:outputText value="Border"/>
                                <p:inputText autocomplete="off" id="txtBorder" value="#{commonReportItemController.current.cssBorder}"/>

                                <h:outputText value="Color"/>
                                <p:inputText autocomplete="off" id="txtColor" value="#{commonReportItemController.current.cssColor}"/>

                                <h:outputText value="Back Color"/>
                                <p:inputText autocomplete="off" id="txtBackColor" value="#{commonReportItemController.current.cssBackColor}"/>

                                <h:outputText value="Perfix"/>
                                <p:inputText autocomplete="off" id="txtPrefix" value="#{commonReportItemController.current.formatPrefix}"/>

                                <h:outputText value="Suffix"/>
                                <p:inputText autocomplete="off" id="txtSuffix" value="#{commonReportItemController.current.formatSuffix}"/>

                               
                            </h:panelGrid>
                        </p:panel>
                    </h:panelGroup>

                    <h:panelGroup id="pPreview"  >
                        <div style="width:21cm;height: 29.7cm; border: 1px solid black; position: relative; font-size: 150%;">
                            <ui:repeat value="#{commonReportItemController.items}" var="myIi" >
                                <div style="#{myIi.cssStyle}; position:absolute ;">
                                    <h:outputText rendered="#{myIi.retired ne true and myIi.ixItemType eq 'Label'}" value="#{myIi.name}" style="color: #{myIi.cssColor} " escape="false" ></h:outputText>
                                    <h:inputText id="txtValue" rendered="#{myIi.retired ne true and myIi.ixItemType eq 'Value'}"  style="color: #{myIi.cssColor}"  ></h:inputText>
                                    <p:watermark for="txtValue" rendered="#{myIi.retired ne true and myIi.ixItemType eq 'Value'}"  value="#{myIi.name}"  ></p:watermark>
                                    <h:panelGroup rendered="#{myIi.retired ne true and myIi.ixItemType eq 'ItemsCatetgory'}" >
                                        <h:selectOneMenu id="cmbRefCat" style="#{myIi.innerCssStyle}" >
                                            <f:selectItem itemLabel="#{myIi.name}"></f:selectItem>
                                            <f:selectItems value="#{categoryController.getSubCategories(myIi.referringCategory) }" var="sc" itemLabel="#{sc.name}" itemValue="#{sc}" ></f:selectItems>
                                        </h:selectOneMenu>
                                    </h:panelGroup>
                                </div>
                            </ui:repeat>
                        </div>
                    </h:panelGroup>


                </p:panelGrid>
            </h:form>
        </h:panelGroup>
    </ui:define>

</ui:composition>